<html>

<head></head>

<body>
    <p>
        <button onclick="myMove()">点我</button>
    </p>

    <div id="myContainer">
        <div id="myAnimation" style="top: 350px; left: 350px;"></div>
    </div>
    <style>
        #myContainer {
          width: 400px;
          height: 400px;
          position: relative;
          background: yellow;
        }
        #myAnimation {
          width: 50px;
          height: 50px;
          position: absolute;
          background-color: red;
        }
    </style>

    <script>
        function myMove() {
          var elem = document.getElementById("myAnimation");   
          var pos = 0;
          var id = setInterval(frame, 10);
          function frame() {
            if (pos == 350) {
              clearInterval(id);
            } else {
              pos++; 
              elem.style.top = pos + 'px'; 
              elem.style.left = pos + 'px'; 
            }
          }
        }
    </script>
</body>

</html>